<template>
	<div class="liveReservation">
		<div class="liveReservation_h clear">
			<router-link to="/teach/live/listappoint">直播预约</router-link>
			<router-link to="/teach/live/listlive">我的直播</router-link>
		</div>

		<!--  -->
		<div class="liveReservation_table"  v-if="placeholder !== true">
			<template>
				<el-table
				border
				:data="liveList"
				style="width: 100%">
					<el-table-column
						prop="name"
						label="直播设备"
						width="259"
						 align="center"
						show-overflow-tooltip>
					</el-table-column>	
					<el-table-column
						prop="comment"
						label="介绍"
						width="240"
						 align="center"
						show-overflow-tooltip>
						<template slot-scope="scope">
						  	<span v-if="scope.row.comment">{{scope.row.comment}}</span>
						  	<span v-else>--</span>
						</template>
					</el-table-column>
					<el-table-column
					    label="课程安排"
					    align="center"
					    width="100">
					    <template slot-scope="scope">
					      	<router-link :to="{path: '/teach/live/reservation', query: {id: scope.row.id, name: scope.row.name}}">查看</router-link>
					    </template>
					  </el-table-column>
					<el-table-column
					    label="操作"
					    align="center"
					    width="100">
					    <template slot-scope="scope">
							<template v-if="scope.row.status == 1">
								<router-link :to="{path: '/teach/live/addappoint', query: {id: scope.row.id}}">预约</router-link>
							</template>
							<template v-else>
								已禁用
							</template>
					    </template>
					  </el-table-column>
				</el-table>
			</template>
			<!--  -->
			<div class="pageBox" v-if="total_number > page_size">
				<el-pagination
					@current-change="change_page"
					:current-page="page_index"
					:page-size="page_size"
					layout="prev, pager, next"
					:total="total_number">
				</el-pagination>
			</div>
		</div>

		<div class="dependent" v-if="placeholder">
			<i class="ipm image_nofound"></i>
			<p>还没发现任何相关的内容哦~</p>
		</div>


		<div class="noticeTxT">
			<h3>使用须知</h3>
			<p>1.需要预约当前时间往后的课程</p>
			<p>2.请预约7天内的课程</p>
			<p>3.一般直播预约</p>
			<p>选择入口<i>></i>选择查询方式（按教室/按时间）<i>></i>选择教室及时间<i>></i>填写预约单</p>
		</div>

	</div>
</template>
<script>

	export default {
		name: '',
		data() {
			return {
				liveList: [],/*类别数据*/
				page_index: 1,
				page_size: this.$g.page_size,
				total_number: 0,
				typeOptions: '', //资源类型
				resourceType: '', //资源类型--val
				placeholder: false,
				livesection: '',
			}
		},
		watch: {
		},
		computed: {
			
		},
		created(){
			this.getLiveList()
		},
		methods: {
			//列表
			getLiveList(){
				let success = ( res => {
					let data = res.data;
					this.liveList = data.data;
					this.total_number = data.data_sum;
					this.page_index = parseInt(data.page_index);
					this.placeholder = this.liveList.length === 0 ? true : false

				});
				this.$ajax({
					url: 'api/recorder/recorder_list',
					method: 'get',
					params: {
						page_index: this.page_index,
						page_size: this.page_size,
						start_time: this.time_s,
						end_time: this.time_e,
						userid: this.$g.user_id
					},
					func: {success: success}
				})
			},
			//分页
			change_page(val) {
				this.page_index = val;
				this.getLiveList()
			}
		}
	}
</script>